<template>
    <el-dialog 
    v-model="visible"
    title="导出乐谱"
    width="30%"
  >
  <div class="export-modal">
     <el-form label-width="80px">
      <el-form-item label="文件名">
        <el-input v-model="filename" />
      </el-form-item>
      
      <el-form-item label="方向">
        <el-select v-model="orientation">
          <el-option label="纵向" value="portrait" />
          <el-option label="横向" value="landscape" />
        </el-select>
      </el-form-item>

      <el-form-item label="纸张">
        <el-select v-model="pageSize">
          <el-option label="A4" value="a4" />
          <el-option label="Letter" value="letter" />
        </el-select>
      </el-form-item>
        <!-- 格式选择 -->
    <el-form-item label="导出格式：">
      <el-select v-model="selectedFormat">
        <el-option
          v-for="format in formats"
          :key="format.value"
          :label="format.label"
          :value="format.value"
        />
      </el-select>
    </el-form-item>

    <!-- 文件名输入 -->
    <el-form-item label="文件名称：">
      <el-input
        v-model="filename"
        placeholder="请输入文件名"
        clearable
      />
    </el-form-item>
    </el-form>
  </div>
    <!-- 操作按钮 -->
    <template #footer>
      <el-button @click="$emit('close')">取消</el-button>
      <el-button type="primary" @click="handleExport">确认导出</el-button>
    </template>
    </el-dialog>
</template>

<script setup>
import { ref } from 'vue';
import { useScoreStore } from '@/stores/scoreStore';
import { ExportService } from '@/services/exportService';
const formats = [
  { value: 'pdf', label: 'PDF文档' },
  { value: 'xml', label: 'XML格式' },
  { value: 'json', label: 'JSON格式' },
  { value: 'text', label: '文本格式' }
]
const selectedFormat = ref('pdf');
const filename = ref('未命名乐谱');
const scoreStore = useScoreStore();

const handleExport = async () => {
  try {
    const exportData = {
      metadata: {
        title: scoreStore.title,
        composer: scoreStore.composer,
        lyricist: scoreStore.lyricist,
        keySignature: scoreStore.keySignature,
        timeSignature: scoreStore.timeSignature,
        tempo: scoreStore.tempo
      },
      bars: scoreStore.bars,
      lyrics: scoreStore.lyrics
    };

    switch(selectedFormat.value) {
      case 'pdf':
        await ExportService.exportToPDF('preview-container', filename.value);
        break;
      case 'xml':
        ExportService.exportToXML(exportData, filename.value);
        break;
      case 'json':
        ExportService.exportToJSON(exportData, filename.value);
        break;
      case 'text':
        ExportService.exportToText(exportData, filename.value);
        break;
    }

    alert('导出成功！');
    $emit('close');
  } catch (error) {
    alert(`导出失败: ${error.message}`);
  }
};
</script>

<style scoped>
</style>